<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <!--标准mui.css-->
    <link rel="stylesheet" href="../static/weixinKp/css/mui.min.css">
    <!--App自定义的css-->
    <link rel="stylesheet" type="text/css" href="../static/weixinKp/css/app.css" />
    <title>开票详情</title>
</head>

<body>
    <div class="wrap">
        <div class="DetailTop">
            <div>
                <span class="DetailActive">委方</span>
            </div>
            <div>
                <span>购方</span>
            </div>
            <div>
                <span>商品</span>
            </div>
            <div>
                <span>发票</span>
            </div>
            <div>
                <span>邮寄</span>
            </div>
        </div>
        <div class="DetailContent">
            <div class="DetailOne" style="display: block;">
                <p class="DetailCompanyName"><span id="conCustomername"></span></p>
                <p class="DetailInfo"><img src="./images/icon_01.png" alt="" class="iconA">名称：<span id="conContacter"></span></p>
                <p class="DetailInfo"><img src="./images/icon_02.png" alt="" class="iconA">联系方式：<span id="conContactphone"></span></p>
                <p class="DetailInfo"><img src="./images/icon_03.png" alt="" class="iconA">地址：<span id="conRegisteraddress"></span></p>
                <p class="DetailInfo">开户行及帐号：<span id="conBankaccount"></span></p>
                <p class="DetailInfo">纳税人识别号：<span id="conTaxpayerid"></span></p>
            </div>
            <div class="DetailTwo">
                <p class="DetailCompanyName" id="buyerName">购方</p>
                <p class="DetailInfo"><img src="./images/icon_01.png" alt="" class="iconA">名称：<span id="buyerContacter"></span></p>
                <p class="DetailInfo"><img src="./images/icon_02.png" alt="" class="iconA">联系方式：<span id="buyerContactphone"></span></p>
                <p class="DetailInfo">开户行及帐号：<span id="buyerBankaccount"></span></p>
                <p class="DetailInfo">纳税人识别号：<span id="buyerTaxpayerid"></span></p>
            </div>
            <div class="DetailThree">

            </div>
            <div class="DetailFour">
                <p class="DetailInfo">发票类型：<span id="invoiceTypeName"></span></p>
                <p class="DetailInfo">发票版本：<span id="invoiceVersionName"></span></p>
                <p class="DetailInfo">发票联次：<span id="invoiceUnionName"></span></p>
                <p class="DetailInfo">发票备注：<span id="invoicenote"></span></p>
            </div>
            <div class="DetailFive">
                <p class="DetailInfo">地址：<span id="address"></span></p>
                <p class="DetailInfo">收件人：<span id="recepter"></span></p>
                <p class="DetailInfo">联系方式：<span id="receptphone"></span></p>
                <p class="DetailInfo ex">快递公司：<span id="expresscompany"></span></p>
                <p class="DetailInfo ex">快递单号：<span id="expressno"></span></p>
            </div>
        </div>
        <!-- <div class="invoicedetail">
            <p class="DetailInfo">发票号：<span class="invoiceNum">04159856</span></p>
            <p class="invoicemoney">￥96,790,68</p>
            <p class="DetailInfo">开票日期：<span id="invoicedate">2017年10月28号</span></p>
            <p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid">作废</span> <span class="RedDashed">红冲</span></p>
            <p class="DetailInfo dec">详情<img src="./images/down.png" alt=""></p>
            <div>
                <p class="DetailInfo">发票类型：<span id="invoiceTypeName"></span></p>
                <p class="DetailInfo">发票版本：<span id="invoiceVersionName"></span></p>
                <p class="DetailInfo">发票联次：<span id="invoiceUnionName"></span></p>
                <p class="DetailInfo">发票备注：<span id="invoicenote"></span></p>
            </div>
            <p class="DetailInfo dec">详情<img src="./images/top.png" alt=""></p>
        </div> -->
    </div>
    <script src="../static/weixinKp/js/jquery-3.2.1.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="../static/weixinKp/js/path.js"></script>
    <script src="../static/weixinKp/js/mui.min.js"></script>
    <script type="text/javascript">
        var userId = document.cookie.split(";")[1].split("=")[1];
        var types = decodeURI(getQueryString('type'));
        var state = decodeURI(getQueryString('state'));
        $('.DetailTop div').click(function() {
            $(this).parents('.DetailTop').find('span').removeClass('DetailActive');
            $(this).find('span').addClass('DetailActive');
            $('.DetailContent div').hide();
            $('.DetailContent div').eq($(this).index()).show();
        })
        $(document).ready(function() {
            var invoiceRecordId = decodeURI(getQueryString('invoiceRecordId'));
            $.ajax({
                url: path + '/app/invoiceRecord/detail',
                dataType: 'json',
                type: 'post',
                headers: {
                    userId: userId
                },
                xhrFields: {
                    withCredentials: true
                },
                data: {
                    invoiceRecordId: invoiceRecordId,
                    state: state
                },
                success: (data) => {
                    console.log(data);
                    $("#conCustomername").text(data.data.conCustomername);
                    $("#conContacter").text(data.data.conContacter);
                    $("#conContactphone").text(data.data.conContactphone);
                    $("#conRegisteraddress").text(data.data.conRegisteraddress);
                    $("#conBankaccount").text(data.data.conBankname + data.data.conBankaccount);
                    $("#conTaxpayerid").text(data.data.conTaxpayerid);
                    $("#buyerName").text(data.data.buyerName);
                    $("#buyerContacter").text(data.data.buyerContacter);
                    $("#buyerContactphone").text(data.data.buyerContactphone);
                    $("#buyerBankaccount").text(data.data.conBankname + data.data.conBankaccount);
                    $("#buyerTaxpayerid").text(data.data.buyerTaxpayerid);
                    $("#invoiceTypeName").text(data.data.invoiceTypeName);
                    $("#invoiceVersionName").text(data.data.invoiceVersionName);
                    $("#invoiceUnionName").text(data.data.invoiceUnionName);
                    $("#invoicenote").text(data.data.invoicenote);
                    $("#address").text(data.data.address);
                    $("#recepter").text(data.data.recepter);
                    $("#receptphone").text(data.data.receptphone);
                    if (data.data.expressno && data.data.expresscompany) {
                        $("#expresscompany").text(data.data.expresscompany);
                        $("#expressno").text(data.data.expressno);
                    } else {
                        $(".ex").hide();
                    }
                    var html = '';
                    var recordGoodsList = data.data.recordGoodsList
                    for (var i = 0; i < recordGoodsList.length; i++) {
                        html += '<ul class="Detailist">';
                        html += '<li>品名:' + recordGoodsList[i].goodsname + '</li>';
                        html += '<li>行业：' + recordGoodsList[i].industryname + '</li>';
                        html += '<li>税率：' + recordGoodsList[i].taxrate + '</li>';
                        html += '<li>型号：' + recordGoodsList[i].goodsmodel + '</li>';
                        html += '<li>单位：' + recordGoodsList[i].goodsunit + '</li>';
                        html += '<li>数量：' + recordGoodsList[i].goodsamount + '</li>';
                        html += '<li>单价：' + recordGoodsList[i].unitprice + '</li>';
                        html += '<li>总价：' + recordGoodsList[i].totalprice + '</li>';
                        html += '</ul>';
                    }
                    var htmls = '';
                    var invRealList = data.data.invRealList;
                    if (invRealList.length > 0) {
                        for (var i = 0; i < invRealList.length; i++) {
                            var time = invRealList[i].invoiceopentime.split(' ');
                            htmls += '<div class="invoicedetail">';
                            htmls += '<p class="DetailInfo">发票号：<span class="invoiceNum">' + invRealList[i].invoiceno + '</span></p>';
                            htmls += '<p class="invoicemoney">￥' + formateMoney(invRealList[i].invoicetotalmoney, 2) + '</p>';
                            htmls += '<p class="DetailInfo">开票日期：<span id="invoicedate">' + time[0] + '</span></p>';
                            htmls += '<input type="hidden" value="' + invRealList[i].invoiceRealId + '"/>';
                            if (invRealList[i].state == 1) {
                                if (types == 1) {
                                    htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid defeat">作废</span>';
                                } else if (types == 2) {
                                    htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="RedDashed dash">红冲</span></p>';
                                } else {
                                    htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid defeat">作废</span> <span class="RedDashed dash">红冲</span></p>';
                                }
                            } else if (invRealList[i].state == 2) {
                                htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid">待红冲</span></p>';
                            } else if (invRealList[i].state == 3) {
                                htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid">已红冲</span></p>';
                            } else if (invRealList[i].state == 4) {
                                htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid">待作废</span></p>';
                            } else if (invRealList[i].state == 5) {
                                htmls += '<p class="DetailInfo" style="border-bottom: 1px dotted #c0c0c0;"><span class="invalid">已作废</span></p>';
                            }
                            htmls += '<div>';
                            htmls += '<p class="DetailInfo dec down">详情<img src="./images/down.png" alt=""></p>';
                            htmls += '<div style="display:none;">';
                            if (invRealList[i].state == 2) {
                                htmls += '<p class="DetailInfo">待红冲申请时间：' + invRealList[i].applytime + '</p>';
                            } else if (invRealList[i].state == 3) {
                                htmls += '<p class="DetailInfo" >已红冲申请时间：' + invRealList[i].applytime + '</p>';
                                htmls += '<p class="DetailInfo" >已红冲完成时间：' + invRealList[i].applydonetime + '</p>';
                                htmls += '<p class="DetailInfo" >已红冲发票号：' + invRealList[i].realinvoiceno + '</p>';
                            } else if (invRealList[i].state == 4) {
                                htmls += '<p class="DetailInfo" >待作废申请时间：' + invRealList[i].applytime + '</p>';
                            } else if (invRealList[i].state == 5) {
                                htmls += '<p class="DetailInfo" >已作废申请时间：' + invRealList[i].applytime + '</p>';
                                htmls += '<p class="DetailInfo" >已作废完成时间：' + invRealList[i].applydonetime + '</p>';
                            }
                            htmls += '<p class="DetailInfo">发票类型：' + invRealList[i].invoiceTypeName + '</p>';
                            htmls += '<p class="DetailInfo">发票版本：' + invRealList[i].invoiceVersionName + '</p>';
                            htmls += '<p class="DetailInfo">发票联次：' + invRealList[i].invoiceUnionName + '</p>';
                            htmls += '<p class="DetailInfo">商品信息</p>';
                            for (var j = 0; j < invRealList[i].realGoodsList.length; j++) {
                                htmls += '<ul class="Detailist">';
                                htmls += '<li>品名:' + invRealList[i].realGoodsList[j].goodsname + '</li>';
                                htmls += '<li>行业：' + invRealList[i].realGoodsList[j].industryname + '</li>';
                                htmls += '<li>税率：' + invRealList[i].realGoodsList[j].taxrate + '</li>';
                                htmls += '<li>总价：' + invRealList[i].realGoodsList[j].totalprice + '</li>';
                                htmls += '</ul>';
                            }
                            htmls += '</div><p class="DetailInfo dec top" style="display:none;">详情<img src="./images/top.png" alt=""></p></div>';
                            htmls += '</div>';
                        }
                    }
                    $(".DetailContent").after(htmls);
                    $('.DetailThree').append(html);
                },
                error: (err) => {
                    mui.alert(err.message);
                }
            })
        })
        // 点开详情
        $(document).on('touchstart', '.down', function() {
            $(this).toggle();
            $(this).next().slideDown(500);
            $(this).siblings('.top').toggle();
        })
        // 关闭详情
        $(document).on('touchstart', '.top', function() {
            $(this).toggle();
            $(this).prev().slideUp(500);
            $(this).siblings('.down').toggle();
        })
        // 作废发票
        $(document).on('touchstart', '.defeat', function() {
            var invoiceRealId = $(this).parents('.invoicedetail').find("input").val();
            var date = $(this).parents('.invoicedetail').find('#invoicedate').text();
            var times = date.split('-');
            var ds = new Date();
            var month = ds.getMonth() + 1;
            if (times[1] == month) {
                $.ajax({
                    url: path + '/app/invoiceReal/withdraw',
                    dataType: 'json',
                    type: 'post',
                    headers: {
                        userId: userId
                    },
                    xhrFields: {
                        withCredentials: true
                    },
                    data: {
                        invoiceRealId: invoiceRealId,
                        state: 4
                    },
                    success: (data) => {
                        console.log(data);
                        if (data.success = 1) {
                            mui.alert(data.message, function() {
                                window.location.replace('./user.html');
                            });
                        }
                    },
                    error: (err) => {
                        mui.alert(err.message)
                    }
                })
            } else {
                mui.alert('只能作废本月发票！');
                return;
            }
        })
        // 红冲发票
        $(document).on('touchstart', '.dash', function() {
            var invoiceRealId = $(this).parents('.invoicedetail').find("input").val();
            var date = $(this).parents('.invoicedetail').find('#invoicedate').text();
            var times = date.split('-');
            var ds = new Date();
            var month = ds.getMonth() + 1;
            var year = ds.getFullYear();
            if (times[0] == year) {
                if (times[1] == (month - 1)) {
                    $.ajax({
                        url: path + '/app/invoiceReal/withdraw',
                        dataType: 'json',
                        type: 'post',
                        headers: {
                            userId: userId
                        },
                        xhrFields: {
                            withCredentials: true
                        },
                        data: {
                            invoiceRealId: invoiceRealId,
                            state: 2
                        },
                        success: (data) => {
                            console.log(data);
                            if (data.success = 1) {
                                mui.alert(data.message, function() {
                                    window.location.replace('./user.html');
                                });
                            }
                        },
                        error: (err) => {
                            mui.alert(err.message)
                        }
                    })
                } else {
                    mui.alert('只能红冲上个月的发票！');
                    return;
                }
            } else if (times[0] == (year - 1)) { //去年12月发票
                if (times[1] == 12 && month == 1) {
                    $.ajax({
                        url: path + '/app/invoiceReal/withdraw',
                        dataType: 'json',
                        type: 'post',
                        headers: {
                            userId: userId
                        },
                        xhrFields: {
                            withCredentials: true
                        },
                        data: {
                            invoiceRealId: invoiceRealId,
                            state: 2
                        },
                        success: (data) => {
                            console.log(data);
                            if (data.success = 1) {
                                mui.alert(data.message, function() {
                                    window.location.replace('./user.html');
                                });
                            }
                        },
                        error: (err) => {
                            mui.alert(err.message)
                        }
                    })
                } else {
                    mui.alert('只能红冲上个月的发票！');
                    return;
                }
            }
        })
    </script>
</body>

</html>
